<!--拒单-->
<!doctype html>
<html>
<head>
	<meta charset="UTF-8">
	<title></title>
	<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
	<link href="../css/mui.min.css" rel="stylesheet" />
	<link rel="stylesheet" type="text/css" href="../css/mui.picker.min.css"/>
	<link rel="stylesheet" type="text/css" href="../css/order.css"/>
</head>

<body class="gray">
	<div class="mui-conten detail refuse loading" id="vueMain">
	    <ul class="mui-table-view">
	        <li class="mui-table-view-cell tls">
	        		<span class="status">已付定金</span>
	        		NO.{{order}}
	        </li>
	        <li class="mui-table-view-cell mui-media">
	        		<a href="javascript:;">
    		            <img class="mui-media-object mui-pull-left" :src="list.goods.img" />
    		            <div class="mui-media-body">
    		                <div class="name">{{list.goods.name}}</div>
    		                <p v-if="list.goods.stro"><span class="mui-pull-right"></span>已选：{{list.goods.stro}}</p>
    		                <p>数量:{{list.goods.amount}}</p>
    		                <p class="total">已支付金额: <span >¥ {{list.goods.real_price}}</span> </p>
    		            </div>
    		        </a>
	        </li>
    		</ul>
    		<ul class="mui-table-view">
	        <li class="mui-table-view-cell sel">
	            <a class="mui-navigate-right">
	                <span class="mui-pull-right cause">请选择</span>
	                拒单原因
	            </a>
	        </li>
	    </ul>
	    <div class="item">
	    		<textarea name="" placeholder="请写下您拒单具体理由" v-model="content" ></textarea>
	    		<!--<p class="total-text">500</p>-->
	    </div>
	    
	    
	    <div class="mui-content-padded" style="padding: 25px 0;">
	    		<button type="button" class="mui-btn mui-btn-block bexta-btn bexta-btn-red tijiao" >提交</button>
	    </div>
	    
	</div>
<script src="../js/mui.js"></script>
<script src="../js/vue.min.js"></script>
<script src="../js/mui.picker.min.js"></script>
<script src="../js/bexta.js"></script>
<script type="text/javascript">
	var apps, views, merchant;
	mui.init();
	mui.plusReady(function () {
	   views = bexta.getWebview();
	   merchant = bexta.getStorage(MERCHANT);
	   bexta.ajax(api.refuse_page, function(res){
	   		initVue(res);
	   }, {data:{uid:merchant.uid, order_no:views.order}});
	});
	function initVue(res){
		apps = new Vue({
			el:"#vueMain",
			data:{
				order:views.order,
				list:res,
				content:"",
				cause:""
			},
			mounted:function(){
				document.querySelector('.loading').classList.add('loadRun');
				var self = this;
				var picker = new mui.PopPicker();
				var d = [];
				mui.each(self.list.reason, function(){
					d.push({
						value:this,
						text:this
					});
				});
				picker.setData(d);
				document.querySelector('.sel').addEventListener('tap', function(){
					document.querySelector('textarea').blur();
		 	  		var that = this;
		 	  		picker.show(function(item){
		 	  			that.querySelector('.cause').innerHTML = item[0].text;
		 	  			self.cause = item[0].text;
		 	  		});
		 	  	});
		 	  	document.querySelector('.tijiao').addEventListener('tap', function(){
		 	  		if( self.cause == "" || self.content =="" ){
		 	  			mui.toast("请选择您的拒单原因和理由");
		 	  			return ;
		 	  		}
		 	  		bexta.ajax(api.check_order, function(res,msg){
		 	  			mui.toast(msg);
		 	  			if( !res ){
		 	  				mui.fire(views.opener().opener(), 'reloading')
							views.opener().close('none');
							mui.later(function(){
								mui.back();
							}, 500);
		 	  			}
		 	  			
		 	  		}, {data:{uid:merchant.uid, order_no:views.order, reason:self.cause,content:self.content, method:2 }});
		 	  	});
			}
		});
	}
</script>
</body>
</html>